<template>
  <view class="content">
    <uni-list>
      <uni-list-item class="font-28" :title="`当前${mydata.typeText}`" :rightText="`${mydata.num}包`"></uni-list-item>
      <uni-list-item>
        <template v-slot:body>
          <view class="fd">
            <text>置换领养狗数</text>
            <input @input="replaceInput" v-model="num" placeholder="请输入狗数" />
          </view>
        </template>
      </uni-list-item>
    </uni-list>
    <text class="mar-top"> 1、每13包沐浴露可置换领养1只狗； </text>
    <text> 2、每次最少置换{{ ruleData.min_num || 0 }}只，最多置换{{ ruleData.mast_num || 0 }}只； </text>
    <text> 3、每天最多置换{{ ruleData.max_day_times || 0 }}次； </text>
    <text> 4、每天最多置换{{ ruleData.max_day_num || 0 }}只； </text>
    <text> 5、每置换{{ ruleData.times_num || 0 }}次后，间隔{{ ruleData.hour_num || 0 }}小时后才能再置换； </text>
    <button @click="submit" type="default">去置换领养狗</button>
  </view>
</template>

<script setup lang="ts">
import { ref, nextTick } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { useUserStoreHook } from '@/store/user';
import { adoptGoods, getGoodsAdoptNum } from '@/api/bgame';
const num = ref('');
const mydata = ref({
  consume_type: '',
  type: '',
  num: 0,
});

const submit = async () => {
  if (!num.value) {
    uni.showToast({
      title: '请输入要领养的数量',
      mask: true,
      icon: 'error',
    });
    return;
  }
  if (num.value - ruleData.mast_num > 0) {
    uni.showToast({
      title: `每次最多领取${ruleData.mast_num || 0}只狗`,
      mask: true,
      icon: 'error',
    });
    return;
  }
  if (num.value - ruleData.min_num < 0) {
    uni.showToast({
      title: `每次最少领取${ruleData.min_num || 0}只狗`,
      mask: true,
      icon: 'error',
    });
    return;
  }
  uni.showLoading({
    title: '领养中...',
    mask: true,
  });
  const res: any = await adoptGoods({
    consume_type: mydata.value.consume_type,
    adopt_num: num.value,
  });
  uni.hideLoading();
  if (1 == res.result) {
    uni.showToast({
      title: '领养成功',
      icon: 'none',
    });
    goto('/pages/dog/myl/index');
  } else {
    uni.showToast({
      title: res.msg || '领养失败',
      mask: true,
      icon: 'error',
    });
  }
};
const ruleData = ref({
  mast_num: '', //每次最多领取狗
  min_num: '', //每次最少领取狗
  max_day_num: '', //每天最多领取狗
  max_day_times: '', //每天最多能领取次数
  times_num: '', //间隔次数
  hour_num: '', //间隔时间
  count_adopt: '', //已领取次数
  sum_apply_num: '', //已领取狗数
  last_time: '', //今日最近一次时间
});
const getDogRule = async () => {
  const res: any = await getGoodsAdoptNum({});
  if (1 == res.result) {
    const { mast_num = 0, min_num = 0, max_day_num = 0, max_day_times = 0, times_num = 0, hour_num = 0, count_adopt = 0, sum_apply_num = 0, last_time = 0 } = res.data || {};
    Object.assign(ruleData.value, {
      mast_num,
      min_num,
      max_day_num,
      max_day_times,
      times_num,
      hour_num,
      count_adopt,
      sum_apply_num,
      last_time,
    });
  }
};

const goto = (path) => {
  uni.navigateTo({
    url: path,
  });
};

const replaceInput = (e: any) => {
  nextTick(() => {
    num.value = parseInt(e.detail.value) || '';
    console.log('replaceInput', num.value);
  });
};

const typeObj = {
  1: '商家置换沐浴露',
  2: '养狗置换沐浴露',
  3: '分享奖励沐浴露',
  4: '新人赠送沐浴露',
  5: '消费赠送沐浴露',
  6: '商家增值沐浴露',
};
onLoad(async (option) => {
  getDogRule();
  await useUserStoreHook().getSign();
  mydata.value.consume_type = option.type || '1';
  mydata.value.typeText = typeObj[option.type] || '商家置换沐浴露';
  mydata.value.num = option.num || '0';
  // getList();
});
</script>

<style lang="scss" scoped>
.content {
  width: 100%;
  height: calc(100vh - 44px);
  padding: 8rpx;
  display: flex;
  flex-direction: column;

  .mar-top {
    margin-top: 30rpx;
  }

  text {
    width: 100%;
    padding: 5rpx;
    margin-top: 5rpx;
  }
  button {
    margin: 30rpx;
    padding: 5rpx;
    color: white;
    background-color: #009900;
  }
}

.fd {
  width: 100%;
  font-size: 28rpx;
  display: flex;
  flex-direction: column;

  input {
    margin-top: 10rpx;
  }
}

.font-28 {
  font-size: 28rpx;
}
</style>
